<template>
	<div class="inConbox clearfix det_bg">
		<!-- 头部 -->
		<Nav :URL="urls.url" :text="urls.text"></Nav>
		<!-- 收益 -->
		<div class="user_income_sel">
			<select name="cars" class="bdr input_celect_items clear_bg " id="clear_bg" v-model="listtypeS" @change="chengIFCLick(listtype,listtypeS,'listtypeSindex')">
				<option v-for="(option,index) in listtype" :key="index" :value="option.text" class="option_styler tran_op">
					{{option.text}}
				</option>
			</select>
		</div>
		<div class="uesr_income_allfee dip ju_al">
			<div class="uesr_income_instant dipW ju_al">
				<i>累计收益</i>
				<span>6666.00</span>
			</div>
			<div class="uesr_income_instant dipW ju_al">
				<i>累计收益</i>
				<span>6666.00</span>
			</div>
		</div>
		<aside class="users_all_list">
			<ul class="users_all_ul">
				<li class="users_all_con dipW ju_al" v-for="item in feeList">
					<div class="user_single_img">
						<img src="../../../static/images/fee/text.jpg" alt="" />
					</div>
					
					<div class="users_single_infos dipW ju_al">
						<i>Dopa</i>
						<span><i>奖励收益</i></span>
					</div>
					<div class="user_single_fee dipW ju_al">
						<i>收益金额 : 600.00</i>
						<span>注册时间 : 2018-5-24</span>
					</div>
				</li>
			</ul>
		</aside>
		<section class="users_time_link time_bg">
			2018-4-25
		</section>
		<aside class="users_all_list">
			<ul class="users_all_ul">
				<li class="users_all_con dipW ju_al" v-for="item in feeList">
					<div class="user_single_img">
						<img src="../../../static/images/fee/text.jpg" alt="" />
					</div>
					
					<div class="users_single_infos dipW ju_al">
						<i>Dopa</i>
						<span><i>奖励收益</i></span>
					</div>
					<div class="user_single_fee dipW ju_al">
						<i>收益金额 : 600.00</i>
						<span>注册时间 : 2018-5-24</span>
					</div>
				</li>
			</ul>
		</aside>
	</div>
</template>
<script>
	import Nav from '../mallConent/mallTopNav'
	export default {
		data() {
			return {
				urls: {
					url: '/bomNav/userContent',
					text: '收益',
				},
				listtypeS: '全部收益', //行业 
				feeList:[1,2,3],//收益列表
				listtype: [{
					img: 'resticon.png',
					ind: true,
					text: '全部收益',
					parameter: '10',
				}, {
					img: 'cloticon.png',
					ind: false,
					text: '奖励收益',
					parameter: '11',
				}, {
					img: 'retail.png',
					ind: false,
					text: '广告收益',
					parameter: '16',
				}],
				shareModel: 'www.baidu.com',
				textareaS: '', // 意见反馈
				ifisOpinion: false, // 反馈成功
			}
		},
		methods: {
			getreturnblok() {
				this.$router.replace({
					path: '/bomNav/userContent'
				})
			},
			chengIFCLick(cc, ss, aa) {
				let d = cc; //循环对象.
				let f = ss; //v-model参数 
				let g = aa
				var j = 0;
				for(var i in d) { //循环数组下标
					d[i].ind = false
					if(d[i].text == f) { //这是判断是不是文字一样
						let j = i;
						d[j].ind = true
						g = d[j].parameter
						if(aa == 'listtypeSindex') {
							this.listtypeSindex = d[j].parameter // v-model 下标
						} else if(aa == 'postertypeSindsex') {
							this.postertypeSindsex = d[j].parameter // v-model 下标
						} else if(aa == 'daySnumberDindex') {
							this.daySnumberDindex = d[j].parameter // v-model 下标
						}
					}
				}
				if(this.daySnumberD != '') {
					this.daySnumberD1s = false;
				} else {
					this.daySnumberD1s = true;
				}
			},
		},
		components: {
			Nav
		} //引入组件
	}
</script>
<style lang="scss" scoped>
	.det_bg {
		margin: 0rem;
		z-index: 51;
		height: 100%;
		background: #f2f2f2;
		position: fixed;
	}
	
	.user_income_sel {
		background: transparent;
		width: 100%;
		position: relative;
		margin-top: .8rem;
		border: 0;
		.input_celect_items {
			width: 100%;
			height: 0.7rem;
			background: #fff;
			margin-bottom: .12rem;
			margin: 0 auto;
			padding-left: 3%;
			font-family: Arial, Helvetica, sans-serif;
			.option_styler {
				width: 100% !important;
				height: 0.3rem !important;
				font-size: .12rem !important;
				color: #333 !important;
				text-align: center;
				font-family: Arial, Helvetica, sans-serif;
			}
		}
	}
	
	select {
		appearance: none;
		-moz-appearance: none;
		-webkit-appearance: none;
		border: 0;
		padding-right: 14px;
	}
	
	select::-ms-expand {
		display: none;
	}
	
	#clear_bg {
		background-image: url("../../../static/images/task/bg_seleace.png");
		background-position-x: 92%;
		background-position-y: center;
		-moz-background-size: 4%;
		background-size: 4%;
		background-repeat: no-repeat;
	}
	
	.uesr_income_allfee {
		width: 100%;
		height: 1.8rem;
		margin-top: .1rem;
		background: #FFFFFF;
		.uesr_income_instant {
			width: 50%;
			i {
				width: 100%;
				text-align: center;
				font-size: .26rem;
				color: #999;
			}
			span {
				margin-top: .2rem;
				width: 100%;
				text-align: center;
				font-size: .46rem;
				color: #FF7200;
				font-weight: 500;
			}
		}
	}
	
	.users_all_list {
		width: 100%;
		margin-top: .1rem;
		background: #FFFFFF;
		.users_all_ul {
			text-decoration: none;
			width: 100%;
			li {
				height: 1.5rem;
				width:100%;
				padding: 0 .4rem;
				border-bottom: .01rem solid #eee;
				.user_single_img{
					width: 20%;
					height:1rem;
					img{
						width: 1.2rem;
						height: 100%;
					}
				}
				.users_single_infos {
					width: 42%;
					padding-left: .13rem;
					height:1rem;
					i {
						width: 100%;
						text-align: left;
						font-size: .26rem;
					}
					span {
						margin-top: .3rem;
						width: 100%;
						height: .5rem;
						text-align: left;
						font-size: .26rem;
						color: #999;
						font-weight: 500;
						i{
							display: inline-block;
							width:50%;
							height: .45rem;
							line-height: .45rem;
							font-size: .24rem;
							font-family: "微软雅黑";
							background: red;
							vertical-align: middle;
							text-align: center;
							border-radius: .05rem;
							color: #FFFFFF;
						}
					}
				}
				.user_single_fee {
					height:1rem;
					width: 36%;
					i {
						width: 100%;
						text-align: left;
						font-size: .24rem;
						color: #999;
					}
					span {
						margin-top: .4rem;
						width: 100%;
						text-align: left;
						font-size: .24rem;
						color: #999;
					}
				}
			}
		}
	}
	.users_time_link{
		width: 100%;
		height: .5rem;
		/*background: pink;*/
		margin: .1rem 0;
		color: #FFFFFF;
		line-height: .5rem;
		padding-left: .5rem;
	}
	.time_bg{  
       background-image: url("../../../static/images/fee/shouyibg.png");
      background-position-x: 0%;
      background-position-y: center;
      -moz-background-size: 4%;
      /*background-size: 4%;*/
      background-repeat: no-repeat;
    }
</style>